{extend name="public/world"}
{block name="title"}人员分配{/block}
{block name="style"}
<style>
.layui-layout-body {overflow: auto;}
.layui-form-select dl dd, .layui-form-select dl dt {
    padding: 0 10px;
    line-height: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
</style>
{/block}
{block name="container"}
<div class="layui-form" lay-filter="layuiadmin-form-useradmin" id="layuiadmin-form-useradmin">
    <div class="layui-card" style="padding: 20px 0 0 0;min-height: 375px;">
        <div class="layui-form-item" id="ownerBox">
            <label class="layui-form-label label-required">项目负责人</label>
            {volist name="pro.owners" id="owner" key="tk"}
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <select name="owner_id[]" lay-filter="owner_id" lay-verify="required" lay-search>
                        <option value="">请选择人员</option>
                        {volist name="users" id="user"}
                        <optgroup label="{$user.role_name}">
                            {volist name="user.sales" id="sale"}
                            <option value="{$sale.id}"{if $owner==$sale.id} selected{/if}>{$sale.real_name}</option>
                            {/volist}
                        </optgroup>
                        {/volist}
                    </select>
                </div>
                {if $tk == 1 }
                <button class="layui-btn layui-btn-radius layui-btn-sm addOwner">增加负责人</button>
                {else /}
                <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
                {/if}
            </div>
            {/volist}
        </div>
        <div class="layui-form-item" id="userBox">
            <label class="layui-form-label">普通成员</label>
            {volist name="pro.teams" id="team" key="tk"}
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <select name="team[]" lay-filter="team" lay-search>
                        <option value="">请选择人员</option>
                        {volist name="users" id="user"}
                        <optgroup label="{$user.role_name}">
                            {volist name="user.sales" id="sale"}
                            <option value="{$sale.id}"{if $team==$sale.id} selected{/if}>{$sale.real_name}</option>
                            {/volist}
                        </optgroup>
                        {/volist}
                    </select>
                </div>
                {if $tk == 1 }
                <button class="layui-btn layui-btn-radius layui-btn-sm addUser">增加成员</button>
                {else /}
                <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
                {/if}
            </div>
            {/volist}
        </div>
        <div class="layui-form-item" id="auditBox">
            <label class="layui-form-label label-required">项目审计</label>
            {volist name="pro.audits" id="audit" key="tk"}
            <div class="layui-input-block">
                <div class="layui-input-inline">
                    <select name="audit_id[]" lay-filter="audit_id" lay-verify="required" lay-search>
                        <option value="">请选择人员</option>
                        {volist name="users" id="user"}
                        <optgroup label="{$user.role_name}">
                            {volist name="user.sales" id="sale"}
                            <option value="{$sale.id}"{if $audit==$sale.id} selected{/if}>{$sale.real_name}</option>
                            {/volist}
                        </optgroup>
                        {/volist}
                    </select>
                </div>
                {if $tk == 1 }
                <button class="layui-btn layui-btn-radius layui-btn-sm addAudit">增加审计</button>
                {else /}
                <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
                {/if}
            </div>
            {/volist}
        </div>
        <div class="layui-form-item layui-hide">
            <input type="button" lay-submit lay-filter="LAY-front-submit" id="LAY-front-submit" value="确认">
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script id="ownerView" type="text/html">
    <div class="layui-input-block">
        <div class="layui-input-inline">
            <select name="owner_id[]" lay-filter="owner_id" lay-search>
                <option value="">请选择人员</option>
                {volist name="users" id="user"}
                <optgroup label="{$user.role_name}">
                    {volist name="user.sales" id="sale"}
                    <option value="{$sale.id}">{$sale.real_name}</option>
                    {/volist}
                </optgroup>
                {/volist}
            </select>
        </div>
        <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
    </div>
</script>
<script id="userView" type="text/html">
    <div class="layui-input-block">
        <div class="layui-input-inline">
            <select name="team[]" lay-filter="team" lay-search>
                <option value="">请选择人员</option>
                {volist name="users" id="user"}
                <optgroup label="{$user.role_name}">
                    {volist name="user.sales" id="sale"}
                    <option value="{$sale.id}">{$sale.real_name}</option>
                    {/volist}
                </optgroup>
                {/volist}
            </select>
        </div>
        <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
    </div>
</script>
<script id="auditView" type="text/html">
    <div class="layui-input-block">
        <div class="layui-input-inline">
            <select name="audit_id[]" lay-filter="audit_id" lay-search>
                <option value="">请选择人员</option>
                {volist name="users" id="user"}
                <optgroup label="{$user.role_name}">
                    {volist name="user.sales" id="sale"}
                    <option value="{$sale.id}">{$sale.real_name}</option>
                    {/volist}
                </optgroup>
                {/volist}
            </select>
        </div>
        <button class="layui-btn layui-btn-radius layui-btn-sm layui-btn-danger delUser"><i class="layui-icon">&#xe67e;</i></button>
    </div>
</script>
<script>
    //JavaScript代码区域
    layui.use(['form', 'laytpl'], function() {
        var $ = layui.$
            , laytpl = layui.laytpl
            , form = layui.form;
        $('.addOwner').click(function(){
            var getTpl = ownerView.innerHTML
            laytpl(getTpl).render({}, function(html){
                $('#ownerBox').append(html);
                $('.delUser').click(function(){
                    $(this).parents('.layui-input-block').remove();
                });
            });
            form.render();
        });
        $('.addUser').click(function(){
            var getTpl = userView.innerHTML
            laytpl(getTpl).render({}, function(html){
                $('#userBox').append(html);
                $('.delUser').click(function(){
                    $(this).parents('.layui-input-block').remove();
                });
            });
            form.render();
        });
        $('.addAudit').click(function(){
            var getTpl = auditView.innerHTML
            laytpl(getTpl).render({}, function(html){
                $('#auditBox').append(html);
                $('.delUser').click(function(){
                    $(this).parents('.layui-input-block').remove();
                });
            });
            form.render();
        });
        $('.delUser').click(function(){
            $(this).parents('.layui-input-block').remove();
            form.render();
        });
    });
</script>
{/block}